<html>
<head>
	<script src="/scripts/mootools-core.js" type="text/javascript"> </script>
	<script src="/scripts/mooimagetip.js" type="text/javascript"> </script>
	<script src="/osgata/scripts/util/media.js" type="text/javascript"> </script>
	<script src="/scripts/StringPrototype.js" type="text/javascript"> </script>
	<style type="text/css">
	#mooimagetip {
	  background-color: #AAC;
	}
	
	#imagetip {
	  background-color: #CCF;
	}
	
	</style>
	<script>
		
		function init() {
			buildFrames(48,'imgtst');
		}
		
		function buildFrames(sz,klass) {
			var myImageTip = new MooImageTip();

			s = "background-color:#AAC; text-align:center; vertical-align:middle; width: $1px; height: $2px";
			
			// thumbnail the top one...
			Array.each($$('img.$1'.$$(klass)),function(img){ img.scaleToMax(sz);});
			
			fsz = sz * 1.1;
			
			Array.each($$('div.$1'.$$(klass)),function(div){ div.set("style", s.$$(fsz, fsz) ); });		
		}
	</script>
</head>

<body onLoad="init();">
	<div class="imgtst" style="text-align:center;padding-top:15px;background-color:#CCF">
		<a href="#" class="imagetip" rel="http://localhost:8088/ETT?action=media.Load&eid=A0-S0-M37" title="yada yada" >
	   		<img class="imgtst" src="http://localhost:8088/ETT?action=media.Load&eid=A0-S0-M37"/>
		</a>
	</div>
	<hr/>
	
	<div class="imgtst" style="text-align:center;padding-top:15px;background-color:#CCF">
		<a href="#" class="imagetip" rel="http://localhost:8088/ETT?action=media.Load&eid=A0-S0-M38" title="yada yada" >
			<img class="imgtst" src="http://localhost:8088/ETT?action=media.Load&eid=A0-S0-M38"/>
		</a>
	</div>
</body>

</html>